<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,initial-scale=1.0,width=device-width" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>资金详情</title>
    <!-- 基本框架 -->
    <link rel="stylesheet" href="../../../css/common.css">
    <script src="../../../script/vue.min.js" type="text/javascript"></script>
    <script src="../../../script/frame.js" type="text/javascript"></script>
    <script src="../../../script/baseConfig.js" type="text/javascript"></script>
    <script src="../../../script/utils.js" type="text/javascript"></script>
    <script src="../../../script/common.js" type="text/javascript"></script>
    <style>
        body{
            background:#FFF;
        }
        .moneyNumber{
          padding-top:0.5rem;
          text-align:center;
        }
        .moneyNumber h3{
          font-weight:normal;
          font-size:0.55rem;
          color:#FF1313;
          height:0.7rem;
          line-height:0.7rem;
        }
        .moneyNumber .green{
          color: #56B12E;
        }
        .moneyNumber span{
          font-size:0.3rem;
          color:#999999;
          height:0.5rem;
          line-height:0.5rem;
          display:block;
          margin-top:0.2rem;
        }
        .wallet_info{
          margin-top:0.6rem;
        }
        .wallet_info .inline{
          margin-bottom:0.55rem;
        }
        .wallet_info .inline h3{
          line-height:0.6rem;
          font-size:0.3rem;
          font-weight:normal;
        }
        .wallet_info .inline p{
          color:#999999;
          padding-left:0.5rem;
          line-height:0.6rem;
          font-size:0.3rem;
          margin:0;
          text-align:right;
        }
    </style>
</head>
<body>
    <div id="app" v-cloak>
        <div id="container">
            <div class="moneyNumber">
                <h3 v-if="item.income < item.pay" class="green">-{{$.parsePrice(item.pay, 4).replace(/00$/,'')}}</h3>
                <h3 v-if="item.income > item.pay" class="red">+{{$.parsePrice(item.income, 4).replace(/00$/,'')}}</h3>
                <span>{{dealStatus}}</span>
            </div>
            <div class="wallet_info">
                <div class="inline disbox">
                    <h3>类型</h3>
                    <p class="disflex">{{item.income > item.pay ? '收入' : '支出'}}</p>
                </div>
                <div class="inline disbox">
                    <h3>订单ID</h3>
                    <p class="disflex">{{item.id}}</p>
                </div>
                <div class="inline disbox">
                    <h3>时间</h3>
                    <p class="disflex">{{item.time_created | dateFormate}}</p>
                </div>
                <div class="inline disbox">
                    <h3>备注</h3>
                    <p class="disflex">{{item.status_text}}</p>
                </div>
            </div>
        </div>
    </div>
    <script type="text/javascript">
        apiready = function() {
            var app = new Vue({
                el:'#app',
                data:{
					iosTest:false,
                    item: {}
                },
                created(){
                    this.item = api.pageParam.data.item;
                },
                filters: {
                    dateFormate: function(time){
                        return utils.tsToDateFormat(time, 'yyyy/MM/dd hh:mm');
                    },
                },
                computed: {
                    dealStatus: function(){
                        var statusTxts = {
                            1: '等待处理',
                            2: '交易成功',
                            3: '交易失败',
                            4: '等待处理(已预付)'
                        };
                        return statusTxts[this.item.status];
                    },
                },
                methods:{

                },
                mounted(){
					$.initJs(this);
                }
            });
        }
    </script>
</body>
</html>
